import React from 'react'
import { Link } from "react-router-dom"
import { useDispatch, useSelector } from 'react-redux'
import { Demo } from '../../../components/Customer/TableComponent'
import { getIdAction } from '../../../store/customerStore/action'
import style from "./index.module.scss"

export default function CustomerLabel() {
    const dispatch = useDispatch()

    const thisId = useSelector((state) => state.customer.id)

    // 表头
    const Columns = [
        {
            title: '标签名称',
            dataIndex: 'name',
            align:'center',
            render: (text) => <a>{text}</a>,
        },
        {
            title: '自动打标签条件',
            dataIndex: 'conditions',
            align:'center',
            render: (text) => <>{text}</>,
        },
        {
            title: '备注',
            dataIndex: 'note',
            ellipsis: true,
            align:'center',
            render: (text) => <>{text}</>,
        },
        {
            title: '操作',
            dataIndex: 'id',
            align:'center',
            render: (text) => {
                return <Link to='/home/customer/information' data-id={text} onClick={(e) => getID(e)}>编辑</Link>
            }

        },
    ];

    // 列表内容
    const DataList = [
       {
           key:'1',
           id:'1',
           name:'良民',
           conditions:'累计成功借贷10笔，累计贷款金额：￥200000.00',
           note:'备注',
       },
       {
        key:'2',
        id:'2',
        name:'老赖',
        conditions:'还款逾期',
        note:'备注',
    }
    ];

    // 跳转时获取id
    const getID = (e) => {
        console.log('as', e.target.dataset.id);
        dispatch(getIdAction(e.target.dataset.id))
        console.log('修改了', thisId);
        // this.props.history.push('/child02')
    }

    return (
        <div className={style.content}>
            <div className={style.title}>
                <h4>数据列表</h4>
                <div className={style.titleRight}>
                    <button>添加</button>
                </div>

            </div>

            {Demo(Columns, DataList, { total: DataList.length, type: false })}

        </div>
    )
}
